import { Canvas, Story, Meta } from "@storybook/blocks";
import { Autocomplete, Stack } from "metabase/ui";
import * as AutocompleteStories from "./Autocomplete.stories";

<Meta of={AutocompleteStories} />

# Autocomplete

Our themed wrapper around [Mantine Autocomplete](https://v6.mantine.dev/core/autocomplete/).

## Docs

- [Mantine Autocomplete Docs](https://v6.mantine.dev/core/autocomplete/)

## Examples

<Canvas of={AutocompleteStories.Default} />

### Size - md

<Canvas of={AutocompleteStories.EmptyMd} />

#### Asterisk

<Canvas of={AutocompleteStories.AsteriskMd} />

#### Description

<Canvas of={AutocompleteStories.DescriptionMd} />

#### Disabled

<Canvas of={AutocompleteStories.DisabledMd} />

#### Error

<Canvas of={AutocompleteStories.ErrorMd} />

#### Read only

<Canvas of={AutocompleteStories.ReadOnlyMd} />

#### Icons

<Canvas of={AutocompleteStories.IconsMd} />

#### Groups

<Canvas of={AutocompleteStories.GroupsMd} />

#### Large sets

<Canvas of={AutocompleteStories.LargeSetsMd} />

### Size - xs

<Canvas of={AutocompleteStories.EmptyXs} />

#### Asterisk

<Canvas of={AutocompleteStories.AsteriskXs} />

#### Description

<Canvas of={AutocompleteStories.DescriptionXs} />

#### Disabled

<Canvas of={AutocompleteStories.DisabledXs} />

#### Error

<Canvas of={AutocompleteStories.ErrorXs} />

#### Read only

<Canvas of={AutocompleteStories.ReadOnlyXs} />

#### Icons

<Canvas of={AutocompleteStories.IconsXs} />

#### Groups

<Canvas of={AutocompleteStories.GroupsXs} />

#### Large sets

<Canvas of={AutocompleteStories.LargeSetsXs} />
